<html>

<head>
  <title>Insert/Edit Form Element INPUT</title>
  <link rel="stylesheet" type="text/css" href="../../../popups/popup.css" />
  <script type="text/javascript" src="../../../popups/popup.js"></script>

	<script type="text/javascript">
var fields = null;
var type;
function Init() {
  __dlg_translate("Forms");
  __dlg_init();
  var param = window.dialogArguments;
  type = param.f_type;
  height = 350;
  document.getElementById("f_type").innerHTML = Xinha._lc('Form Element: INPUT', "Forms") + '(' + type + ')';
  // document.getElementById("txt").style.display = "none";
  // document.getElementById("chk").style.display = "none";
  // document.getElementById("btn").style.display = "none";
  // document.getElementById("img").style.display = "none";
  switch (type) 
  {
    case "text":
    case "password":
      	fields = ["f_name", "f_value", "f_readOnly", "f_disabled", "f_tabindex", "f_accesskey", "f_size", "f_maxLength","ScriptName"];      
      	document.getElementById("txt").style.display = "block";
      	document.getElementById("img").style.display = "none";
      	document.getElementById("chk").style.display = "none";
      	break;
    case "checkbox":
    case "radio":
      fields = ["f_name", "f_value", "f_checked", "f_disabled", "f_tabindex", "f_accesskey","ScriptName"];
      document.getElementById("chk").style.display = "block";
      document.getElementById("img").style.display = "none";
      document.getElementById("txt").style.display = "none";
      break;
    case "button":
      fields = ["f_name", "f_value", "f_disabled", "f_tabindex", "f_accesskey","ScriptName"];
      document.getElementById("btn").style.display = "block";
      document.getElementById("chk").style.display = "none";
      document.getElementById("txt").style.display = "none";
      document.getElementById("img").style.display = "none";
      break;        
    case "file":
      fields = ["f_name", "f_disabled", "f_tabindex", "f_accesskey"];
      document.getElementById("f_value").disabled = true;
      document.getElementById("chk").style.display = "none";
      document.getElementById("img").style.display = "none";
      document.getElementById("txt").style.display = "none";
      document.getElementById("btn").style.display = "none";
      break;
    case "image":
      fields = ["f_name", "f_disabled", "f_tabindex", "f_accesskey", "f_src"];
      document.getElementById("img").style.display = "block";
      document.getElementById("f_value").disabled = true;
      document.getElementById("chk").style.display = "none";
      document.getElementById("txt").style.display = "none";
      break;
    case "reset":
    case "submit":
      fields = ["f_name", "f_value", "f_disabled", "f_tabindex", "f_accesskey"];
      document.getElementById("btn").style.display = "none";
      document.getElementById("img").style.display = "none";
      document.getElementById("chk").style.display = "none";
      document.getElementById("txt").style.display = "none";      
      break;
    case "hidden":
      fields = ["f_name", "f_value"];
      document.getElementById("f_disabled").disabled = true;
      document.getElementById("f_tabindex").disabled = true;
      document.getElementById("f_accesskey").disabled = true;
      document.getElementById("chk").style.display = "none";
      document.getElementById("img").style.display = "none";
      break;
  }
  
  for (var i in fields) 
  {
    switch (fields[i]) 
    {
    	case "ScriptName":
            document.getElementById(fields[i]).value = param[fields[i]];
            break;
    	case "f_readOnly":
    	case "f_disabled":
    	case "f_checked":
      		document.getElementById(fields[i]).checked = (param[fields[i]]==fields[i].substring(2,20)) || (param[fields[i]] == true); 
      		break;
    	default:
      		document.getElementById(fields[i]).value = param[fields[i]]; 
      		break;
    }
  }
  
  window.resizeTo(320,height);
  document.getElementById("f_name").focus();
}

function onOK() 
{
  var el = document.getElementById("f_name");
  if (!el.value) {
    alert(Xinha._lc("You must enter a Name","Forms"));
    el.focus();
    return false;
  }
  // pass data back to the calling window
  var param = new Object();
  for (var i in fields) 
  {
    switch (fields[i]) 
    {
    	case "ScriptName":
         	param["f_"+document.getElementById(fields[i]).value]= document.getElementById("f_onclick").value;
            break;
    	case "f_readOnly":
    	case "f_disabled":
    	case "f_checked":
      		if(Xinha.is_ie)
        		param[fields[i]] = (document.getElementById(fields[i]).checked)?true:"";
      		else
        		param[fields[i]] = (document.getElementById(fields[i]).checked)?fields[i].substring(2,20):"";
      		break;
    	default:
      		param[fields[i]] = document.getElementById(fields[i]).value; break;
    }
  }
  __dlg_close(param);
  return false;
}

function onCancel() 
{
  __dlg_close(null);
  return false;
}

</script>
</head>
<body class="dialog" onload="Init()">
  <div id="f_type" class="title"></div>
  <form action="" method="get">
    <div class="fr">Name/ID:</div>
    <input type="text" name="f_name" id="f_name" title="Name of the form input" />
    <p />
    <div class="fr" align="left">Value:</div>
    <input type="text" name="f_value" id="f_value" title="Value of the form input" />
    <p />
    <div class="fr" align="left">Disabled</div>
    <input type="checkbox" name="f_disabled" id="f_disabled" value="disabled" />
    <p />

  <div id="chk">
    <div class="fr" align="left">Checked</div>
      <input name="f_checked" id="f_checked" type="checkbox" />
    <p />
  </div>

  <div class="fr" align="left">Tab Index:</div>
  <input type="text" name="f_tabindex" id="f_tabindex" />
  <p />
  <div class="fr" align="left">Access Key:</div>
  <input type="text" name="f_accesskey" id="f_accesskey" />
  <p />
	
  <div id="txt">
    <div class="fr" align="left">Read Only</div>
    <input type="checkbox" name="f_readOnly" id="f_readOnly" value="readOnly" />
    <fieldset>
        <legend>Dimensions</legend>
        <div class="space"></div>
        <div class="fr">Size:</div>
        <input type="text" name="f_size" id="f_size" size="5" title="Size of text box in characters" />
        <div class="space"></div>
        <div class="fr">Max length:</div>
        <input type="text" name="f_maxLength" id="f_maxLength" size="5"	title="Maximum number of characters accepted" />
        <div class="space"></div>
    </fieldset>
  </div>
            
   <div id="btn">
      <fieldset>
        <legend>Script</legend>
        <div class="space"></div>
        <table>
           <tr>                   
               <td>
               		Select Event:
                   <select name="ScriptName" id="ScriptName" title="Javascript Events">
                       <option value="onclick"></option>
                       <option value="onclick">onclick</option>
                       <option value="ondblclick">ondblclick</option>
                       <option value="onkeydown">onkeydown</option>
                       <option value="onkeypress">onkeypress  </option>
                       <option value="onkeyup">onkeyup </option>
                       <option value="onmousedown">onmousedown</option>
                       <option value="onmousemove">onmousemove</option>
                       <option value="onmouseout" >onmouseout</option>
                       <option value="onmouseover">onmouseover </option>
                       <option value="onmouseup">onmouseup </option>
                       <option value="onreset">onreset</option>
                       <option value="onreset">onsubmit</option>
                   </select>   
               </td>
               <td>
               FunctionName:                
               <div id="inputbox" name="inbox" >
                      <input type="text" name="f_onClick" id="f_onclick" title="Event" />
                </div>
                </td>
           </tr>
           <tr>
            	<td colspan="2">
            	New JavaScript Code:
                      <div id="newjs">
   						
                    			<textarea id="fun_bodyt"></textarea>             
					</div>
               </td>
           </tr>
          </table>
    <div class="space"></div>
	</fieldset>
  </div>
  
  <div id="img">
    <fieldset>
    <legend>Image source</legend>
      <div class="space"></div>
      <div class="fr">Image URL:</div>
      <input type="text" name="f_src" id="f_src" title="URL of image" />
      <div class="space"></div>
    </fieldset>
  </div>
  
  <div id="buttons">
    <button type="button" name="ok" onclick="return onOK();">OK</button>
    <button type="button" name="cancel" onclick="return onCancel();">Cancel</button>
  </div>
  
</form>
</body>
</html>
